<template>
  <div>姓名：{{ name }}</div>
  <div>年龄：{{ obj.age }}</div>
  <button @click="changeName()">改变数据</button>
</template>
<script setup>
//reactive只能定义对象数据
import { reactive, toRef, toRefs } from "vue";
let obj = reactive({ name: "zhailei", age: 20 });

//toRefs
let { name, age } = toRefs(obj);

//toRef
let nl = toRef(obj, "age");

function changeName() {
  name.value = "13";
}
</script>
<style scoped></style>
